<template>
  <div>
<div>
      <span>用户名:</span>
      <input type="text" v-model="username" />
    </div>
    <div>
      <span>密码:</span>
      <input type="password" v-model="pass" />
    </div>
    <div>
      <span>来自于哪里?</span>
      <select v-model="from">
        <option value="选择">请选择</option>
        <option value="西安">陕西-西安</option>
        <option value="燕京">北京-燕京</option>
        <option value="大连">辽宁-大连</option>
      </select>
    </div>
    <div>
      <!-- checkbox特殊, 内部判断v-model是数组, 绑定value值, 非数组绑定checked属性 -->  
      <span>爱好</span>
      <input type="checkbox" v-model="hobby" value="吃饭" /><span>吃饭</span>
      <input type="checkbox" v-model="hobby" value="逛街" /><span>逛街</span>
      <input type="checkbox" v-model="hobby" value="旅游" /><span>旅游</span>
    </div>
    <div>
      <span>性别</span>
      <input type="radio" name="sex" v-model="sex" value="男" /><span>男</span>
      <input type="radio" name="sex" v-model="sex" value="女" /><span>女</span>
    </div>
    <div>
      <span>自我介绍</span>
      <textarea v-model="intro"></textarea>
    </div>
  </div>
</template>

<script>
export default {
data () {
    return {
        username:'',
        pass:'',
        from:'选择',
        hobby:'',
        sex:'男',
        intro:'说点什么吧...'
    }
}
}
</script>

<style>

</style>